<template>
  <Layout title="任务详情" :has-back="true" :has-tabbar="false" ref="layout">
    <view
      style="
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        padding: 20rpx;
        display: flex;
        flex-direction: column;
      "
    >
      <view style="flex: 1; min-height: 0">
        <view style="width: 100%; height: 100%">
          <Scroll>
            <u-form label-width="180rpx" :labelStyle="{ fontSize: '40rpx' }">
              <u-form-item label="发布时间">
                <text style="font-size: 40rpx">{{ task.sendDatetime }}</text>
              </u-form-item>
              <u-form-item label="是否完成">
                <view style="width: auto">
                  <u-tag
                    :type="getTag(task.isComplete).type"
                    :text="getTag(task.isComplete).text"
                    size="large"
                  ></u-tag>
                </view>
              </u-form-item>
              <view class="top">
                <u-form-item label="发布内容" label-position="top">
                  <u-textarea
                    v-model="task.content"
                    height="700rpx"
                    :maxlength="-1"
                    :disabled="true"
                  ></u-textarea>
                </u-form-item>
              </view>
            </u-form>
          </Scroll>
        </view>
      </view>
      <u-button @click="entry" type="primary" v-if="task.isComplete === '2'">
        <text style="font-size: 40rpx">确认完成</text>
      </u-button>
    </view>
  </Layout>
</template>
<script>
import Layout from "@/pages/component/layout/index.vue";
import Scroll from "@/pages/component/scroll/index.vue";
import { editTaskByUuid } from "@/api/task";

export default {
  components: { Layout, Scroll },
  onLoad(event) {
    this.task = JSON.parse(event.query);
  },
  data() {
    return {
      task: {},
    };
  },
  methods: {
    async entry() {
      let result = await uni.showModal({
        title: "确认提示",
        content: "确认已经完成本任务",
      });
      if (result.confirm && !result.cancel) {
        let task = { ...this.task, isComplete: "1" };
        await editTaskByUuid(task);
        await uni.navigateBack();
      }
    },
    getTag(isComplete) {
      if (isComplete === "1") {
        return {
          type: "success",
          text: "已完成",
        };
      } else if (isComplete === "2") {
        return {
          type: "error",
          text: "未完成",
        };
      }
    },
  },
};
</script>
